<template>
	<view>
		<view class="zaiui-user-login-avatar-view">
			<view class="cu-avatar round lg" style="background-image:url(https://kshht.gzmsdw.cn/imge_zsyy/html/my/mine_def_touxiang_3x.png);" />
		</view>

		<view class="flex flex-direction zaiui-btn-view">
			<button @click="getUserInfo" :loading="loginLoading" :class="loginLoading ? 'loginLoading' : ''" class="cu-btn bg-blue cuIcon-weixin">
				<text class="padding-left-sm">微信一键登陆</text>
			</button>
		</view>

		<view class="zaiui-agreement-checked-view zaiui-foot-ad-view">
			<view class="text-sm text-black-view">
				<view class="text-gray" style="display: flex;justify-content: center;">
					<u-checkbox-group
						placement="column"
						@change="isChecked = !isChecked"
					>
						<u-checkbox
							label="登录代表已同意以下协议"
							checked
						>
						</u-checkbox>
					</u-checkbox-group>
				</view>
				<view class="text-blue">《用户服务协议》和《隐私政策》</view>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
export default {
	data() {
		return {
			readState: false,
			loginLoading: false,
			isLogin: false,
			showAuthorizeModal: false,
			phoneState: false,
			isChecked: true,
			phone: ''
		};
	},
	methods: {
		toast(message, type = 'warning') {
			this.$refs.uToast.show({
				message,
				icon: false,
				type
			});
		},
		hideModal(e) {
			this.showAuthorizeModal = false;
		},
		getUserInfo(e) {
			if(this.isChecked) {
				this.loginLoading = true;
				uni.getUserProfile({
					desc: '登录',
					success: result => {
						uni.login({
							provider: 'weixin',
							success: res => {
								this.login(res.code, result.userInfo);
							}
						});
					},
					fail: err => {
						this.toast('你取消了授权，登录失败', 'error');
						this.loginLoading = false;
					}
				});
			} else {
				this.toast('请勾选同意后再进行登录');
			}
		},
		login(code, userInfo) {
			console.log(123)
			console.log(code)
			console.log(userInfo)
			this.$api.miniLogin({
				data: {
					jsCode: code
				},
				success: res => {
					console.log(456)
					console.log(res)
					if (parseInt(res.data.code) == 200) {
						this.isLogin = true;
						this.toast('登录成功', 'success');
						userInfo.accessToken = res.data.data.accessToken;
						uni.setStorageSync('userInfo', userInfo);
						this.$api.syncUserInfo({
							data: {
								avatarUrl: userInfo.avatarUrl,
								nickname: userInfo.nickName
							},
							success: res => {
								console.log('0030')
								console.log(res)
								if (res.data.code == 200) {
									userInfo.detail = res.data.data;
									uni.setStorageSync('userInfo', userInfo);
									setTimeout(() => {
										uni.navigateBack();
									}, 800);
								} else {
									this.toast('同步更新用户信息失败', 'error');
								}
							},
							fail: res => {
								this.toast('同步更新用户信息失败', 'error');
							},
							complete: () => {
								this.loginLoading = false;
							}
						});
					} else {
						this.toast(res.data.msg || '登录失败', 'error');
					}
				},
				fail:(err) => {
					console.log(err)
				},
				complete: () => {
					this.loginLoading = false;
				}
			});
		}
	}
};
</script>

<style lang="scss">
.loginLoading {
	background-color: #005aa7;
}
.zaiui-user-login-avatar-view {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 218.18rpx;
	.cu-avatar {
		width: 181.81rpx;
		height: 181.81rpx;
	}
}
.zaiui-btn-view {
	position: relative;
	margin-top: 72.72rpx;
	padding: 0 45.45rpx;
	.cu-btn .icon {
		position: relative;
		font-size: 47.27rpx;
		right: 9.09rpx;
		top: -3.63rpx;
	}
}
.zaiui-agreement-checked-view {
	position: relative;
	padding: 27.27rpx 45.45rpx;
	.zaiui-checked {
		position: absolute;
		transform: scale(0.7);
	}
	.text-black-view {
		padding-left: 54.54rpx;
		line-height: 47.27rpx;
	}
}
.zaiui-foot-ad-view {
	position: fixed;
	text-align: center;
	bottom: 72.72rpx;
	width: 100%;
}
</style>
